import { customElement, OnEvent, onEvent } from 'dom-native';
import { logoff } from '../ts/user-ctx';
import { BaseViewElement } from '../ts/v-base';

@customElement('v-main')
export class MainView extends BaseViewElement {

	//#region    ---------- Element Events ---------- 
	//> In this section put all of the @onEvent bindings, which is event bound to the `this` element.

	@onEvent('pointerup', '.do-logoff')
	async LogoffClicked(evt: MouseEvent & OnEvent) {
		evt.preventDefault;
		await logoff();
		window.location.href = '/';
	}

	//#endregion ---------- /Element Events ----------

	//#region    ---------- Lifecycle ---------- 
	init() {
		super.init();
		this.innerHTML = _render();
	}
	//#endregion ---------- /Lifecycle ---------- 

}


function _render() {
	return `
	<header>		
		<c-menu>
			<li class="do-logoff">Logoff</li>
		</c-menu>
	</header>
	<main>		
	</main>
`;
}